<template>
  <view class="container">
    <headertit :title="title + '车信息'" :showFilter="false" />
    <!-- 信息 -->
    <ve-card :title="title + '车信息'">
      <!-- <ve-cell-val :label="title + '车牌号'" :value="record.licenseNo" /> -->
      <ve-cell :label="title + '车牌号'">
        <text style="margin-right: 12rpx"> {{ record.licenseNo || '-' }} </text>
        <ve-tag color="red" :title="record.tagName" v-if="record.tagName" />
      </ve-cell>
      <ve-cell-val :label="title + '车型'" :value="record.modelName" />
      <ve-cell-val :label="title + '车里程'" :value="record.carMileage" />
      <ve-cell-val :label="title + '车油(电)量'" :value="record.oil" />
      <ve-cell :label="title + '车照片'" layout="vertical">
        <ve-upload disabled v-model="record.img" />
      </ve-cell>
      <ve-cell :label="title + '车视频'" layout="vertical">
        <ve-upload-video v-model="record.video" readonly />
      </ve-cell>
    </ve-card>
  </view>
</template>

<script setup>
  import { ref } from 'vue'
  import { onLoad } from '@dcloudio/uni-app'
  import headertit from '@/pages/operate/components/headertit.vue'

  const record = ref({})
  const title = ref('')
  onLoad((options) => {
    const data = JSON.parse(options.data)
    title.value = '换上'
    if (options.status == 1) {
      title.value = '换下'
      record.value = {
        licenseNo: data.replaceReturnLicenseNo,
        modelName: data.replaceReturnModelName,
        carMileage: data.replaceReturnCarMileage,
        oil: data.replaceReturnFuelNum,
        img: data.returnFileIds,
        video: data.returnVideoFileIds,
        tagName: data.replaceReturnLabel,
      }
      return
    }
    record.value = {
      licenseNo: data.replaceGiveLicenseNo, //车牌号
      modelName: data.replaceGiveModelName, //车型
      carMileage: data.replaceGiveCarMileage, //车里程
      oil: data.replaceGiveFuelNum, //车油(电)量
      img: data.giveFileIds, //车照片
      video: data.giveVideoFileIds, //车视频
      // 删除标签
      tagName: data.replaceGiveLabel,
    }
  })
</script>

<style lang="less" scoped>
  .container {
    padding: 24rpx;
  }
</style>
